<!--
 * @页面名称:全文
 * @描述: 
 * @作者: 
 * @Date:
-->
<template>
  <div class="fulltext">
    <Header title="全文" @clickLeft="clickLeft" />
    <!-- 全文列表 -->
    <var-list :finished="finished" v-model:loading="loading" finished-text="没有更多了" @load="onLoad">
      <!-- 文档整体内容 -->
      <var-row class="list" justify="center" align="center" v-for="(item, index) in fulltextList" :key="index">
        <!-- 文档左侧 -->
        <var-col span="24">
          <var-cell center :description="item.AI_UploadDateTime" :title="item.AI_Name" @click="preview(item)">
            <!-- 文档左侧图标 -->
            <template #icon>
              <var-image width="35" height="35" :src="item.fileIcon" />
            </template>
          </var-cell>
        </var-col>
      </var-row>
    </var-list>
    <!-- 全文预览 -->
    <preview
      v-if="fulltextConfig.visible"
      :visible="fulltextConfig.visible"
      :type="fulltextConfig.type"
      :fileList="fulltextConfig.fileList"
      :download="fulltextConfig.download"
      :print="fulltextConfig.print"
      @updataVisible="updataVisible"
    ></preview>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive } from "vue";
import { previewFulltext } from "../preview/ts/index";
import Preview from "../preview/Preview.vue";
import useCurrentInstance from "@/utils/useCurrentInstance";
import { useRoute, useRouter } from "vue-router";
import Header from "../header/index.vue";

const route = useRoute();
const router = useRouter();

const { proxy } = useCurrentInstance();

// 加载状态
const loading = ref(false);
// 完成状态
const finished = ref(false);
// 全文数据
const fulltextList: any = ref([]);
// 全文预览配置参数
const fulltextConfig = reactive({
  // 预览全文配置参数
  visible: false,
  fileList: [] as any[],
  type: "",
  download: false,
  print: false
});
// 加载数据
const onLoad = () => {
  proxy.$vueAxios
    .post("Master_Base_AllInfos/GetConditional", {
      order: "aI_Index asc",
      dtoList: [{ fieldName: "Record_ID", fieldValue: route.query.Record_ID }]
    })
    .then((res: any) => {
      fulltextList.value = res.List;
      iconAssignment(fulltextList.value);
      loading.value = false;
    });
  finished.value = true;
};
//给文件赋值图标
const iconAssignment = (data: any) => {
  //循环遍历给列表赋值图标
  for (const key in data) {
    //获取当前文件
    const dataSuffix = data[key];
    //suffix获取文件后缀名
    let suffix = dataSuffix.AI_Source_Extension.slice(1);
    if (
      [
        "mp4",
        "wmv",
        "avi",
        "asf",
        "asx",
        "rm",
        "rmvb",
        "3gp",
        "mov",
        "m4v",
        "dat",
        "mkv",
        "flv",
        "vob",
        "webm",
        "3g2",
        "mpg",
        "ogv",
        "m2ts",
        "swf"
      ].includes(suffix)
    ) {
      suffix = "mp4";
    } else if (["mp3", "wav", "ogg", "aac", "wma", "flac", "m4a", "mka", "opus"].includes(suffix)) {
      suffix = "mp3";
    }
    dataSuffix.fileIcon = getImageUrl(suffix);
  }
};
// 获取图片
const getImageUrl = (name: string) => {
  return new URL(`../../../assets/fileimg/${name}.png`, import.meta.url).href;
};
// 预览
const preview = (item: any) => {
  previewFulltext(item, proxy);
};
// 更新预览窗口状态
const updataVisible = (value: boolean) => {
  fulltextConfig.visible = value;
};
// 返回上一级
const clickLeft = () => {
  router.back();
};
</script>

<style scoped></style>
../preview/ts/index.ts
